<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="../00-source/jquery.min.js"></script>
</head>
<body>
    <div id="box">
        2222
    </div>
    <script>
        /*
            在之前讲js的时候，我们讲了很多对于dom节点的创建、插入、删除...等。jQuery的开发者当然也做了封装，我们一起来看下吧

            jQuery创建一个节点真的很容易
                $('<div>') === $(document.createElement('div'))
                $('<div>123123</div>') === document.createElement('div').innerHTML = '123123'

            插入
                append() 其实和原生js中的append()差不多，插入到最后面
                appendTo() 和append()执行的任务相同，但是这个是子节点在前面，父节点在括号里面

                prepend() 插入到最前面
                prependTo() 这个就不用我说了吧，参考上面appendTo()
        */
       let div = $('<div>1111</div>')
       let div2 = $('<div>').html('3333')
        $('#box').append(div)
        div2.appendTo($('#box'))
    </script>
</body>
</html>